<!DOCTYPE html> 
<html> 
<head>  
    <!--META-->
    <meta charset="utf-8">
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
    <meta name="msapplication-tap-highlight" content="no" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">

    <!--CSS-->
    <link rel="shortcut icon" href="img/favicon.ico">
    <link rel="stylesheet" href="API/css/themes/default/jquery.mobile.min.css" />
    <link rel="stylesheet" href="API/css/mycss.css" />
    <link rel="stylesheet" href="css/mycss.css" />

    <!--JS-->
    <script type="text/javascript" src="include/config.js"></script>
    <script type="text/javascript" src="API/js/Jquery/jquery.min.js"></script>
    <script type="text/javascript" src="API/js/JqueryMobile/jquery.mobile.min.js"></script>
    <script type="text/javascript" src="API/js/functionsLib.js"></script>

    <script language="javascript" type="text/javascript">
    ///////////////////
    //BLOCK VARIABLE GLOBAL
    ///////////////////

    ///////////////////
    //BLOCK FONCTIONS EVENEMENTS
    ///////////////////
    //Fin chargement page
    function OnLoad() {
        try {
            
        } catch (er) {
            $.functionsLib.log(0, "ERROR(OnLoad):" + er.message);
        }
    }

    ///////////////////
    //BLOCK FONCTIONS METIER
    ///////////////////
    function creercompte() {
        try {
            var p_nom = $("#nom").val();
            var p_prenom = $("#prenom").val();
            var p_email = $("#email").val();
            var p_motDePasse = $("#motDePasse").val();
            var p_identifiant = angular.element('[ng-controller=OdaCreateCptController]').scope().identifiant;
            
            var result = $.functionsLib.addUtilisateur(p_nom, p_prenom, p_email, p_motDePasse, p_identifiant);

            if(result["strErreur"] == ""){
                var infoUser = result["data"]["infosUser"];

                var contact_mail_administrateur = $.functionsLib.getParameter("contact_mail_administrateur");

                var message_html = "";
                message_html = "<html><head></head><body>";
                message_html += "Bonjour "+p_prenom+",<br>";
                message_html += "<br>";
                message_html += "Votre compte a bien &eacute;t&eacute; cr&eacute;&eacute;.<br>";
                message_html += "<br>";
                message_html += "Pour rappel : <br>";
                message_html += "- votre identifiant : "+infoUser["code_user"]+"<br>";
                message_html += "- votre mot de passe : "+p_motDePasse+"<br>";
                message_html += "<br>";
                message_html += "Merci est rendez-vous <a href='"+domaine+"'>ici</a><br>";
                message_html += "<br>";
                message_html += "L'&eacute;quipe<br>";
                message_html += "</body></html>";

                var paramsMail = {
                    email_mails_dest : infoUser["mail"]+"," 
                    ,email_mail_ori : contact_mail_administrateur
                    , email_labelle_ori : "Service Mail ODA"
                    , email_mail_reply : contact_mail_administrateur
                    , email_labelle_reply : "Service Mail ODA"
                    , email_mails_cache : contact_mail_administrateur
                    , message_html : message_html
                    , sujet : "[ODA]Création de compte réussi."
                };

                $.functionsLib.sendMail(paramsMail);

                var strHtml = "F&eacute;licitation votre compte a bien &eacute;t&eacute; cr&eacute;&eacute; (N&deg;"+infoUser["id"]+", identifiant : "+infoUser["code_user"]+").";
                $.functionsLib.notification(strHtml, $.functionsLib.oda_msg_color.SUCCES);
                
                //UpdateAngular
                angular.element('[ng-controller=OdaCreateCptController]').scope().formulaire.input.nom.value = "";
                angular.element('[ng-controller=OdaCreateCptController]').scope().formulaire.input.prenom.value = "";
                angular.element('[ng-controller=OdaCreateCptController]').scope().formulaire.input.email.value = "";
                angular.element('[ng-controller=OdaCreateCptController]').scope().formulaire.input.motDePasse.value = "";
                angular.element('[ng-controller=OdaCreateCptController]').scope().identifiant.value = "";
                angular.element('[ng-controller=OdaCreateCptController]').scope().$apply();
            }else{
                var strHtml = "Erreur de cr&eacute;ation de votre compte, merci de contacter l'administrateur.";
                $.functionsLib.notification(strHtml, $.functionsLib.oda_msg_color.WARNING);
            }
        } catch (er) {
            $.functionsLib.log(0, "ERROR(creercompte):" + er.message);
        }
    }
    </script>
</head> 

<body onload="OnLoad();" ng-app="odaApp"> 

    <!-- page -->
    <div data-role="page" data-title="Cr&eacute;er un compte">

        <!-- header -->
        <div data-role="header">
            <h1>Cr&eacute;er un compte</h1>
            <a href="javascript:window.location = ('./api_page_contact_restreint.html?mili='+$.functionsLib.getMilise());" data-role="button" data-icon="info" data-iconpos="notext">Contact</a>
        </div>
        <!-- /header -->

        <!-- content -->
        <div data-role="content" id="main_content" ng-controller="OdaCreateCptController" ng-form='{{formulaire.valide}}'>
            <div data-role="collapsible" data-collapsed="false" data-mini="true" id="div_creationCompte">
                <h4>Formulaire de compte</h4>
                <div class="ui-grid-b ui-responsive">
                    <div class="ui-block-a">
                        <label for="nom" id="label_nom" style="width: 75%" ng-class="{'valide' : formulaire.input.nom.valide, 'notValide' : !formulaire.input.nom.valide}">Saisir votre nom* :</label>
                        <input type="text" name="nom" id="nom" value="" data-mini="true" placeholder="votre nom ici" ng-model="formulaire.input.nom.value" ng-tips='{{formulaire.input.nom.tips}}'/>
                        <label for="nom" id="tips_nom" class="tips">&nbsp;</label>
                        <label for="prenom" id="label_prenom" style="width: 75%" ng-class="{'valide' : formulaire.input.prenom.valide, 'notValide' : !formulaire.input.prenom.valide}">Saisir votre pr&eacute;nom* :</label>
                        <input type="text" name="prenom" id="prenom" value="" data-mini="true" placeholder="vore pr&eacute;nom ici" ng-model="formulaire.input.prenom.value" ng-tips='{{formulaire.input.prenom.tips}}'/>
                        <label for="prenom" id="tips_prenom" class="tips">&nbsp;</label>
                    </div>
                    <div class="ui-block-b" style="width:5%;">
                        &nbsp;
                    </div>
                    <div class="ui-block-b">
                        <label for="email" id="label_email" style="width: 75%" ng-class="{'valide' : formulaire.input.email.valide, 'notValide' : !formulaire.input.email.valide}">Saisir votre e-mail* :</label>
                        <input type="text" name="email" id="email" value="" data-mini="true" placeholder="votre e-mail ici" ng-model="formulaire.input.email.value" ng-tips='{{formulaire.input.email.tips}}'/>
                        <label for="email" id="tips_email" style="width: 75%" class="tips">&nbsp;</label>
                        <label for="motDePasse" id="label_motDePasse" ng-class="{'valide' : formulaire.input.motDePasse.valide, 'notValide' : !formulaire.input.motDePasse.valide}">Saisir votre mot de passe* :</label>
                        <input type="text" name="motDePasse" id="motDePasse" value="" data-mini="true" placeholder="votre mot de passe ici" ng-model="formulaire.input.motDePasse.value" ng-tips='{{formulaire.input.motDePasse.tips}}'/>
                        <label for="motDePasse" id="tips_motDePasse" class="tips">&nbsp;</label>
                    </div>
                </div>
                <span>Votre identifiant : {{identifiant}}</span>
            </div>
            <a href="javascript:window.location = ('./index.html?mili='+$.functionsLib.getMilise());" data-role="button" data-inline="true" data-icon="arrow-r" data-mini="true">Retour</a>					
            <a href="javascript:creercompte();" data-role="button" data-inline="true" data-icon="arrow-r" data-mini="true" ng-class="{'ui-state-disabled' : !formulaire.valide, 'ui-btn-active' : formulaire.valide}">Soumettre</a>					
        </div>
        <!-- /content -->

        <!-- footer -->
        <div data-role="footer" data-position="fixed">
            <h1>Nouvel utilisateur</h1>
        </div>
        <!-- /footer -->

    </div>
    <!-- /page -->
    
    <script type="text/javascript" src="API/js/AngularJs/angular.min.js"></script>
    <script type="text/javascript" src="API/js/AngularJs/odaApp.js"></script>
    <script>
        app.directive('ngForm', function(){
            return {
                template: function(elem){
                    elem.bind('keyup', function(event){
                        ((event.keyCode == 13) && (elem.context.getAttribute("ng-form") != 'false')) ? creercompte() : null;
                    });
                }
            };
        });
                
        app.controller('OdaCreateCptController', function($scope) {
            $scope.formulaire = {
                valide : false,
                input : {
                    nom : {
                        value : ''
                        ,valide : false
                        ,attendu : /^[a-zA-Z-ÁÀÂÄÉÈÊËÍÌÎÏÓÒÔÖÚÙÛÜáàâäéèêëíìîïóòôöúùûüÇç\s]{2,}$/g
                        ,tips : 'Que des caract&egrave;res et &agrave; minima de deux lettres.'
                    }
                    ,prenom : {
                        value : ''
                        ,valide : false
                        ,attendu : /^[a-zA-Z-ÁÀÂÄÉÈÊËÍÌÎÏÓÒÔÖÚÙÛÜáàâäéèêëíìîïóòôöúùûüÇç\s]{2,}$/g
                        ,tips : 'Que des caract&egrave;res et &agrave; minima de deux lettres.'
                    }
                    ,email :{
                        value : ''
                        ,valide : false
                        ,attendu : /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]{2,}[.][a-zA-Z]{2,4}$/g
                        ,tips : 'Utiliser le format standard.'
                    }
                    ,motDePasse :{
                        value : ''
                        ,valide : false
                        ,attendu : /^[a-zA-Z0-9]{8,}$/g
                        ,tips : 'Au moins 8, il doit avoir des lettres et des chiffres.'
                    }  
                }
            };
        
            $scope.$watch('formulaire', function(){
                $scope.formulaire.input.nom.valide = ($scope.formulaire.input.nom.value.match($scope.formulaire.input.nom.attendu)) ? true : false;
                $scope.formulaire.input.prenom.valide = ($scope.formulaire.input.prenom.value.match($scope.formulaire.input.prenom.attendu)) ? true : false;
                $scope.formulaire.input.email.valide = ($scope.formulaire.input.email.value.match($scope.formulaire.input.email.attendu)) ? true : false;
                $scope.formulaire.input.motDePasse.valide = ($scope.formulaire.input.motDePasse.value.match($scope.formulaire.input.motDePasse.attendu)) ? true : false;
                $scope.formulaire.valide = ($scope.formulaire.input.nom.valide && $scope.formulaire.input.prenom.valide && $scope.formulaire.input.email.valide && $scope.formulaire.input.motDePasse.valide);
            }, true);
            
            $scope.$watch('formulaire.input', function(){
                var v_identifiant = "";
                if(($scope.formulaire.input.nom.value.length > 2)&&($scope.formulaire.input.prenom.value.length > 2)){
                    v_identifiant = ($scope.formulaire.input.prenom.value.substring(0,2)+$scope.formulaire.input.nom.value.substring(0,2)).toUpperCase();
                }
                
                $scope.identifiant = v_identifiant;
            }, true);
        });
    </script>
	
</body>
</html>